<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('修改供应商')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-supplier-edit" th:object="${scmSupplier}">
            <input name="id" th:field="*{id}" class="form-control" type="hidden">
            <div class="form-group">
                <label class="col-sm-3 control-label">供应商名称：</label>
                <div class="col-sm-8">
                    <textarea name="name" class="form-control">[[*{name}]]</textarea>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">联系人 ：</label>
                <div class="col-sm-8">
                    <input name="contactPerson" th:field="*{contactPerson}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">联系电话 ：</label>
                <div class="col-sm-8">
                    <input name="tel" th:field="*{tel}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">邮箱 ：</label>
                <div class="col-sm-8">
                    <input name="email" th:field="*{email}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">备注：</label>
                <div class="col-sm-8">
                    <textarea name="remark" class="form-control">[[*{remark}]]</textarea>
                </div>
            </div>
            <div class="btn-group-sm pull-right"  role="group">
                <a class="btn btn-primary" onclick="saveSupplier()">
                    <i class="fa fa-edit"></i> 保存供应商
                </a>
            </div>
            <a class="btn btn-primary" onclick="addData()">
                <i class="fa btn-success"></i> 添加项目
            </a>
            <div class="row">
                <div class="col-sm-12 select-table table-striped">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var prefix = ctx + "system/supplier";
        $("#form-supplier-edit").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                var json = classformToJson($('.form-control'));
                json['id']=0;
                if(json['name']==null||json['name']==undefined||json['name']==""){
                    $.modal.alertError("请录入供应商名称");
                    return;
                }
                var productData = getData();
                for (let i = 0; i <productData.length ; i++) {
                    var product = productData[i];
                    var stashId = product.stashId;
                    var productCount = product.productCount;
                    if(stashId==null||stashId==undefined||stashId==""){
                        $.modal.alertError("请录入采购商品仓库信息");
                        return ;
                    }
                    if(productCount==null||productCount==undefined||productCount==""||productCount=="请点击输入"){
                        $.modal.alertError("请录入采购商品数量信息");
                        return ;
                    }
                }
                json['details']=productData;

                $.operate.save(prefix + "/edit", $('#form-supplier-edit').serialize());
            }
        }

        var id = $("#id").val();
        if(id==null||id==''){
            id=0;
        }
        var options = {
            createUrl: prefix + "/add",
            url:  prefix+"/detail/list?id="+id,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            showPageGo: false,
            pagination: false,
            onEditableSave: onEditableSave,
            columns: [{
                checkbox: true
            },
                {
                    field : 'projectId',
                    title : '项目id',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='hidden' id='projectId%s' name='projectId' value='%s'>", index, value);
                        return html+row.projectId;
                    }
                },
                {
                    field: 'projectName',
                    title: '项目名称',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='hidden' id='projectName%s' name='projectName' value='%s'>", index, value);
                        return html+row.projectName;
                    }
                },
                {
                    field : 'contactPerson',
                    title : '联系人',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='hidden' id='contactPerson%s' name='contactPerson' value='%s'>", index, value);
                        return html+row.contactPerson;
                    }
                }, {
                    field : 'tel',
                    title : '联系人',
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='hidden' id='tel%s' name='tel' value='%s'>", index, value);
                        return html+row.tel;
                    }
                },
                {
                    field: 'projectRate',
                    title: '项目费率',
                    editable: true,
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='projectRate' id='projectRate%s' name='projectRate' value='%s'>", index, value);
                        return html;
                    }
                },
                {
                    field: 'remark',
                    title: '备注',
                    editable: true,
                    formatter: function(value, row, index) {
                        var html = $.common.sprintf("<input class='form-control' type='text' id='remark%s' name='remark' value='%s'>", index, value);
                        return html;
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-danger btn-xs" href="javascript:void(0)" onclick="removeData(\'' + index + '\')"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
        function onEditableSave (field, row, rowIndex, oldValue, $el) {

            // alert("字段名：" + field + "，当前值：" + row[field]  + "，旧值：" + oldValue);

        }
        function addProduct(productData) {

            var newRow = {
                projectId: productData.id,
                projectName: productData.projectName,
                contactPerson: productData.contactPerson,
                tel: productData.tel,
                email: productData.email,
                remark: productData.remark,
                projectRate:0
            };
            $("#" + table.options.id).bootstrapTable('append',newRow);

        }

        function classformToJson(form) {
            var jsonObj = {};
            form.each(function (){
                let val = $(this).val();
                let name = $(this).attr('name');
                jsonObj[name] = val;
            })
            return jsonObj;
        }

        function addData(){
            // $.modal.closeTab();
            $.operate.selectProduct("/system/project/projectListPage",selectProductCallback);
            // $("#" + table.options.id).bootstrapTable('append',newRow);

        }

        function selectProductCallback(productId) {

            console.log("selectProductCallback"+productId);

            var config = {
                url: ctx+"system/project/detail/"+productId,
                type: "post",
                dataType: "json",
                data: null,
                beforeSend: function () {
                    $.modal.loading("正在处理中，请稍候...");
                },
                success: function(result) {
                    console.log(result);
                    console.log(result.data);
                    addProduct(result.data);
                    $.modal.closeLoading();
                }
            };
            $.ajax(config);

        }


        function  saveSupplier(){
            var json = classformToJson($('.form-control'));
            var QuotationData = [];
            $("#" + table.options.id+" tbody tr").each(function (){
                var quotation = {}
                $(this).find(".form-control").each(function (){
                    var n, v;
                    n = $(this).attr("name");
                    v = $(this).val();
                    quotation[n] = v;
                })
                QuotationData.push(quotation);
            })
            json['projectReqList']=QuotationData;
            //var data = $("#form-in-add").serializeArray();
            var config = {
                url: prefix+"/edit",
                type: "post",
                data: JSON.stringify(json),
                contentType:"application/json",
                beforeSend: function () {
                    $.modal.loading("正在处理中，请稍候...");
                },
                success: function(result) {
                    if(result.code==0){
                        $.modal.alertSuccess("保存成功");
                        $.modal.closeTab();
                    }else{
                        $.modal.alertError(result.msg);
                    }
                    console.log(result);
                }
            };
            $.ajax(config);

        }
        function removeData(index){
            var data = $("#" + table.options.id).bootstrapTable('getData');
            data.splice(index, 1);
            $("#" + table.options.id).bootstrapTable('load', data);

        }
    </script>
</body>
</html>
